//  显示console.log
        // if (typeof (VConsole) != "undefined") {
        //     var vConsole = new VConsole();
        // };
//编译模版
(function() {
  // 缓存编译模板
  var cache = {};

  // 当前激活的实例
  var instance = null;

  var Template = window.Template = {

    // 编辑
    compile: function(selector, context) {
      var translate = cache[selector];
      if (!translate) {
        var fragment = selector;
        var container = $(selector);
        if (container.is('[type="text/swig-template"]')) {
          fragment = container.html();
        }
        cache[selector] = translate = swig.compile(fragment);
      }
      return translate(context).toString();
    },

    // 通过选择器编译
    render: function(selector, context, fn) {
      fn = fn || $.noop;
      this.remove();
      instance = $(this.compile(selector, context));
      $('body').append(instance);
      fn(instance, context);
      return instance;
    },

    // 隐藏
    hide: function() {
      if (instance) {
        instance.hide();
      }
    },

    // 移除
    remove: function() {
      if (instance) {
        instance.remove();
        instance = null;
      }
    },

    // 句柄
    getInstance: function() {
      return instance;
    }
  };
})();

var hh='<tbody class="portLists">\
<tr>\
<th></th>\
<th>接口描述</th>\
<th>路由地址</th>\
<th class="thJsonData">json数据</th>\
<th>操作</th>\
</tr>\
{% for item in portMsg %}\
<tr>\
<td class="idNum">{{item.idNum}}</td>\
<td class="portName">{{item.portName}}</td>\
<td class="route">{{item.route}}</td>\
<td class="jsonData">{{item.jsonData}}</td>\
<td class="lastTd"><span class="findData"><a>查看</a></span><span class="modify"><a class="modifyA">编辑</a></span><span class="deleteData">删除</span></td>\
</tr>\
  {% endfor %}\
  </tbody>' 

  //显示控制table margin-top
  var headerHeight=$('header').height();
  // console.log(headerHeight)
  $('.placeTable').offset({'top':headerHeight})
$('.addBtn').click(function(){
    window.location.href='/page';
  })
$.post('/ajax/list',{}).then(function(list){
    // console.log(list)
    if(list.code===200){
  var data=list.data;
  // console.log(portMsg)
  //增添dom结构
  var tmp = Template.compile(hh, data);
  $('.tableContent').html(tmp);
  //搜索数据
  function searchDatas(){
    var searchRoute=$('#search').val();
    $('.portLists').find('tr').css('background-color','#fff')
    // console.log(searchRoute)
   var arr=$('#table .route');
   var num=0;
  //  console.log(arr);
   for(var i=0;i<arr.length;i++){
     var tableRoute=arr[i].innerHTML;
     console.log(tableRoute)
     if(searchRoute===tableRoute){
       num++;
      //  console.log(i);
      $('.portLists').find('tr').eq(i+1).css('background-color','#ccc')
      var divTop=$('.portLists').find('tr').eq(i+1).offset().top;
      var clientHeight=$(window).height();
      var headerHeight=$('header').height();
      var firstTrHeight=$('.portLists').find('tr').eq(0).height();
      console.log(divTop);
      console.log(clientHeight);
          $(window).scrollTop(divTop-headerHeight-firstTrHeight);  
      break;
     }
   }
   if(num==0){
     alert('没有这条数据')
   }
  }
  //回车搜索
  $('#search').on('keypress',function(e){
      var ev=window.event||e;
      if(ev.keyCode===13){
        searchDatas();
        $('#search').val('');
      }
  });
  // 搜索按钮
  $('.searchBtn').click(function(){
    searchDatas();
    $('#search').val('');
  });
    
        // 查看数据
        $('.findData').click(function(){
          var index=$('.findData').index(this);
          window.location.href='/api/'+$('.route').eq(index).html();
        })
      //编辑数据
      $('.modify').on('click',function(){
           console.log($('.modify').index(this));
           var index=$('.modify').index(this);
          window.location.href='/page/'+ $('.route').eq(index).html();
   })

   //删除数据
   $('.deleteData').on('click',function(){
    var index=$('.deleteData').index(this)
      $.post('/ajax/deleteData',{
        route:$('.route').eq(index).html()
      }).then(function(res){
        console.log('成功')
        console.log(res);
        window.location.href='/list';
      })
   })
    }
  }) 
   
